<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title></title>
    @include('common-css')
    <style>

        .input_box {
            width: 100%;
            height: 40px;
            margin-top: 15px;
            margin-bottom: 15px;
            display: flex;
            justify-content: flex-start;
            align-items: center;
        }

        .input_label {
            width: 120px;
            box-sizing: border-box;
        }

        .project-table {
            margin-top: 15px;
        }

        .status-tag {
            color: #1890ff;
            border: 1px solid #91d5ff;
            border-radius: 3px;
            background: #e6f7ff;
            font-size: 12px;
            padding: 2px 3px;
        }

        .ant-table-tbody > tr > td, .ant-table-thead > tr > th {
            vertical-align: middle;
            line-height: 25px;
        }

        .search_box {
            width: 1000px;
        }

        .search_box input {
            width: 300px;
        }

        .search_box button {
            margin-left: 20px;
        }

        .search_box .ant-select {
            margin-left: 20px;
        }
    </style>
</head>
<body>

<div id="app"></div>

<script id="appTemplate" type="x-template">
    <a-locale-provider :locale="antdLocale">
        <div class="container">

            @include('committee.header-tpl')

            <main>
                <div class="common_container">

                    @include('committee.aside-tpl')

                    <div class="common_content admin_common_content">
                        <div style="margin-top: 20px; margin-bottom: 20px">
                            <a-button type="primary"
                                      :disabled="!atPhaseMeetingReview"
                                      @click="submitMeetingConfirmTip.flag = true">提交会评结果
                            </a-button>

                            <a-button @click="setAwardsDialog = true"
                                      :disabled="!atPhaseMeetingReview">设置授予奖项比例
                            </a-button>

                            <small style="font-size: 12px;color: #5e5e5e;margin-right: 10px">
                                项目总数 <span style="color: red"> @{{ projectsCount }} </span>个,
                            </small>
                            <small v-for="item in awards_configure"
                                   style="font-size: 12px;color: #5e5e5e;margin-right: 10px">
                                <span>@{{ item.title }} - </span>
                                数量：<span style="color: red">@{{ item.number }}</span>，
                                占比：<span style="color: red">@{{ isNumber(Math.ceil((item.number / projectsCount) * 100)) }}%</span>,
                            </small>
                        </div>

                        <a-table class="project-table"
                                 rowKey="project_id"
                                 size="small"
                                 :columns="projectTableColumns"
                                 :dataSource="filteredProjects"
                                 :loading="loadingPageData"
                                 :pagination="{pageSize: 10000, hideOnSinglePage: true, position: 'both', showTotal: total => `共 ${total} 项`}">

                            <span slot="meeting_ranking"
                                  slot-scope="text, record"
                                  :id="record.project_id"
                                  title="设置排名">
                                <a-spin :spinning="rankChangeProcess && rankChangeItem == record.project_id"/>
                                <a-input-number v-model="record.meeting_ranking"
                                                :disabled="!atPhaseMeetingReview"
                                                style="width: 60px"
                                                size="small"
                                                :min="1"
                                                :max="filteredProjects.length"
                                                @change="record.isChange = true"
                                                @blur="rankChange(record)"/>
                            </span>
                            <span slot="award" slot-scope="text, record">
                                @{{ record.award ? record.award : '未获奖' }}
                            </span>
                            <span slot="application_form" size="large" slot-scope="text, record">
                                <a :href="'/home/view-form?id=' + record.project_id" target="_blank">查看</a>
                            </span>
                            <span slot="attachments" slot-scope="text, record">
                                <a :href="'/home/view-attachments?project_id=' + record.project_id" target="_blank">
                                    <span>查看</span>
                                </a>
                            </span>
                            <span slot="score_time_costs" size="large" slot-scope="text, record">
                                <template v-for="reviewer_score in record.score_per_reviewer">
                                    <span v-html="formatScoreTimeCost(reviewer_score.score_time_cost)"/><br>
                                </template>
                            </span>
                            <span slot="reviewer_scores" size="large" slot-scope="text, record">
                                <template v-for="reviewer_score in record.score_per_reviewer">
                                    <span>@{{ reviewer_score.score !== null ? reviewer_score.score : '-' }}</span><br>
                                </template>
                                <label v-if="!record.scores_normal"
                                       style="color: red;">@{{ record.scores_desc }}</label>
                            </span>
                            <span slot="is_evidence_material_valid" size="large" slot-scope="text, record">
                                <template v-for="reviewer_score in record.score_per_reviewer">
                                    <label>@{{ reviewer_score.is_evidence_material_valid === null ? '-' :
                                        (reviewer_score.is_evidence_material_valid === 1 ? '是' : '否') }}</label>
                                    <br>
                                </template>
                            </span>
                            <span slot="reviewer_remarks" size="large" slot-scope="text, record">
                                <template v-for="reviewer_score in record.score_per_reviewer">
                                    <a-textarea :disabled="true" :autosize="{minRows: 1, maxRows: 10}"
                                                v-model="reviewer_score.remark"/>
                                    <br>
                                </template>
                            </span>
                        </a-table>
                    </div>

                </div>
            </main>

            <a-modal title="设置授予奖项比例"
                     :visible="setAwardsDialog"
                     :confirm-loading="confirmLoading"
                     @cancel="cancelAwardsConfirm"
                     @ok="setAwardsConfirm">
                <div style="margin-bottom: 10px">
                    <a-radio-group v-model="awardsType"
                                   @change="awardsTypeChange"
                                   button-style="solid">
                        {{--<a-radio-button :value="0">--}}
                            {{--一等奖--}}
                        {{--</a-radio-button>--}}
                        {{--<a-radio-button :value="1">--}}
                            {{--二等奖--}}
                        {{--</a-radio-button>--}}
                        {{--<a-radio-button :value="2">--}}
                            {{--三等奖--}}
                        {{--</a-radio-button>--}}

                        <a-radio-button v-for="award of awards_configure" :value="award.key - 1" :key="award.key">
                            @{{ award.title }}
                        </a-radio-button>
                    </a-radio-group>
                </div>
                <a-radio-group v-model="setAwardsMode"
                               @change="setAwardsModeChange">
                    <a-radio-button value="number">
                        设置数量
                    </a-radio-button>
                    <a-radio-button value="ratio">
                        设置比例
                    </a-radio-button>
                </a-radio-group>
                <a-input-number v-model="awardsNum"
                                @change="setAwardsNumChange"
                                style="width: 160px"
                                :min=1
                                :max="awardsNumMax"
                                :placeholder="setNumPlaceholder"/>
                <small style="font-size: 12px;color: #5e5e5e"> 入选项目@{{awards_configure[awardsType].number}},占比@{{
                    Math.round((awards_configure[awardsType].number / projectsCount) * 100) }}%
                </small>
                <div style="margin-top: 10px">
                    <p v-for="item in awards_configure">
                        <span>@{{ item.title }} - </span>
                        <span>数量：@{{ item.number }} ，</span>
                        <span>占比：@{{ Math.ceil((item.number / projectsCount) * 100)  }}%</span>
                    </p>
                </div>
            </a-modal>


            <!--提交网评二次确认@satrt-->
            <!--提交网评二次确认@2020-07-07-->
            <a-modal :title="submitMeetingConfirmTip.title"
                     :visible="submitMeetingConfirmTip.flag"
                     @ok="submitMeetingConfirm(true)"
                     @cancel="submitMeetingConfirm(false)">
                <p>@{{ submitMeetingConfirmTip.message }}</p>
            </a-modal>
            <!--提交网评二次确认@end-->

        </div>
    </a-locale-provider>
</script>

@include('common-js')
@include('committee.header-js')
@include('committee.aside-js')

<script>
    var queryParams = parseUrl(location.href).params;
    var awardsInfo = {!! json_encode(array_values(config('vars.awards')), JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT) !!};

    var projectTableColumns = [
        {
            width: 60,
            title: '名次',
            dataIndex: 'meeting_ranking',
            scopedSlots: {
                customRender: 'meeting_ranking'
            }
        },

            @if($awardId == '1')
        {
            width: 60,
            title: '网评名次',
            dataIndex: 'meeting_initial_ranking'
        },
            @endif

        {
            width: 80,
            title: '获奖',
            scopedSlots: {
                customRender: 'award'
            }
        },
        {
            width: 150,
            title: '项目名称',
            dataIndex: 'project_name',
        },
        {
            width: 100,
            title: '申报者',
            dataIndex: 'applicant',
        },
        {
            width: 60,
            title: '申报书',
            dataIndex: 'application_form',
            scopedSlots: {
                customRender: 'application_form'
            }
        },
        {
            width: 60,
            title: '附件',
            dataIndex: 'attachments',
            scopedSlots: {
                customRender: 'attachments'
            }
        },
        // {
        //     width: 100,
        //     title: '评分时长',
        //     dataIndex: 'score_time_costs',
        //     scopedSlots: {
        //         customRender: 'score_time_costs'
        //     }
        // },
        // {
        //     width: 70,
        //     title: '专家评分',
        //     dataIndex: 'reviewer_scores',
        //     scopedSlots: {
        //         customRender: 'reviewer_scores'
        //     }
        // },
        // {
        //     width: 70,
        //     title: '附件证明材料是否真实有效',
        //     dataIndex: 'is_evidence_material_valid',
        //     scopedSlots: {
        //         customRender: 'is_evidence_material_valid'
        //     }
        // },
        // {
        //     width: 200,
        //     title: '专家意见',
        //     dataIndex: 'reviewer_remarks',
        //     scopedSlots: {
        //         customRender: 'reviewer_remarks'
        //     }
        // },

            @if($awardId == '1')
        {
            width: 60,
            title: '平均分',
            dataIndex: 'avg_score',
        },
        @endif

        // {
        //     width: 80,
        //     title: '网评状态',
        //     dataIndex: 'score_status',
        //     scopedSlots: {
        //         customRender: 'score_status'
        //     }
        // },
        {
            width: 80,
            title: '会评状态',
            dataIndex: 'meeting_review_status',
        },
        // {
        //     width: 100,
        //     title: '操作',
        //     key: 'operations',
        //     scopedSlots: {
        //         customRender: 'operations'
        //     }
        // }
    ];
</script>

<script>
    var app = new Vue({
        el: '#app',
        template: '#appTemplate',
        data: {
            profCategoryFilter: '',
            searchKeyword: '',

            projectTableColumns,
            pageData: [],
            projectsCount: 0,
            loadingPageData: false,

            rankChangeProcess: false,
            rankChangeItem: 0,

            awards_configure: [
                {
                    key: 1,
                    number: 0,
                    title: '一等奖'
                }
            ],
            awards_configure_default: [
                {
                    key: 1,
                    number: 0,
                    title: '一等奖'
                }
            ],
            awardsType: 0,
            setAwardsDialog: false,
            setAwardsMode: 'number',
            setNumPlaceholder: '',
            awardsNum: 0,
            awardsNumMax: 100,
            awardsCount: 0,
            awardsRatio: 0,
            confirmLoading: false,

            submitMeetingConfirmTip: {
                flag: false,
                title: '操作确认',
                message: '确认提交会评结果?',
                confirmCount: 0,
            },

            editRankProjectId: 0,

            largeGroupId: -1,
            maxAwardRate: 50,

            // 项目的专家组评分状态
            SCORE_STATUS_TO_SCORE: 1,
            SCORE_STATUS_ABNORMAL_SCORES: 2,
            SCORE_STATUS_TO_LEADER_REVIEW: 3,
            SCORE_STATUS_LEADER_REVIEW_PASSED: 4,
            SCORE_STATUS_LEADER_REVIEW_REJECTED: 5,

            LEADER_REVIEW_RESULT_PASSED: '通过',
            LEADER_REVIEW_RESULT_REJECTED: '不通过',

            REVIEW_STATUS_TO_REVIEW: '待评审',
            REVIEW_STATUS_PASSED: '通过',
            REVIEW_STATUS_REJECTED: '不通过',

            queryParams,
            awardsInfo,
            profCategories,

            asideSelectedKeys:
                queryParams.aside_key ? [queryParams.aside_key] : [],
            antdLocale:
            antd.locales.zh_CN,
            ...CommitteeHeader.data,
            ...CommitteeAside.data,
            ...Workflow.data,
        },
        computed: {
            atPhaseMeetingReview() {
                return this.atPhases(['E'], this.largeGroupId)
            },
            notAtPhaseMeetingReview() {
                return !this.atPhaseMeetingReview
            },
            filteredProjects() {
                var projects = this.searchFilteredProjects;
                if (this.profCategoryFilter) {
                    projects = projects.filter(project => {
                        return project.prof_category == this.profCategoryFilter
                    })
                }
                var num = 1;
                projects.forEach(project => {
                    project.num = num++
                });
                return projects
            },
            searchFilteredProjects() {
                var projects;
                if (this.searchKeyword) {
                    var q = this.searchKeyword.trim();
                    projects = this.pageData.filter(project => {
                        var text = project.project_name + project.applicant + project.project_name + project.avg_score;
                        return text.toLowerCase().indexOf(q) != -1
                    })
                } else {
                    projects = this.pageData
                }
                return projects
            },
        },
        mounted() {
            this.reloadPageData();
            this.reloadWorkflowPhases()
        },
        methods: {
            isNumber(number) {
                return isNaN(number) ? 0 : number
            },
            handleSubmitMeetingReviewResult() {
                axios.post('/api/committee/leader-submit-meeting-review-result').then(response => {
                    if (response.data.ok) {
                        success('提交成功');
                        this.reloadWorkflowPhases()
                        this.reloadPageData()
                    } else {
                        error('提交失败: ' + response.data.msg)
                    }
                })
            },
            formatScoreTimeCost(scoreTimeCost) {
                if (scoreTimeCost === null) {
                    return '-'
                } else if (scoreTimeCost < 60) {
                    return `<span style="color: red;">${scoreTimeCost}秒</span>`
                } else if (scoreTimeCost < 3600) {
                    let minutes = parseInt(scoreTimeCost / 60);
                    let seconds = scoreTimeCost % 60;
                    let content = `${minutes}分钟${seconds}秒`;
                    return scoreTimeCost < 300 ? `<span style="color: red;">${content}</span>` : content
                } else if (scoreTimeCost < 86400) {
                    let hours = parseInt(scoreTimeCost / 3600);
                    let minitues = Math.round(scoreTimeCost % 3600 / 60);
                    return `${hours}小时${minitues}分钟`
                } else {
                    let days = parseInt(scoreTimeCost / 86400);
                    let hours = Math.round(scoreTimeCost % 86400 / 3600);
                    return `${days}天${hours}小时`
                }
            },
            reloadPageData() {
                this.loadingPageData = true;
                axios.get('/api/committee/get-manage-large-group-meeting-review-data').then(response => {
                    let data = response.data;
                    if (data.ok) {
                        if (data.projects.length < 1) {
                            warn('暂无数据')
                            this.loadingPageData = false
                            return
                        }
                        data.projects.forEach(project => project.toMeetingReview = project.meeting_review_status === this.REVIEW_STATUS_TO_REVIEW)
                        this.pageData = data.projects;

                        this.projectsCount = data.projects.length
                        this.awardsNumMax = this.projectsCount
                        this.setNumPlaceholder = '入选数量(0~' + this.awardsNumMax + ')'

                        this.largeGroupId = data.large_group_id;
                        this.awards_configure = data.awards_configure
                        this.awards_configure_default = JSON.parse(JSON.stringify(data.awards_configure))
                        this.awardsNum = data.awards_configure[0]['number']

                    } else {
                        error('加载页面数据失败: ' + data.msg)
                    }
                    this.loadingPageData = false
                })
            },

            //调整排名
            rankChange(item) {
                //排名输入虽然聚焦但是没有修改排名时不提交
                if (item.isChange !== true) {
                    return
                }
                this.rankChangeProcess = true
                this.rankChangeItem = item.project_id
                axios.post('/api/committee/set-meeting-rank',
                    {project_id: item.project_id, rank: item.meeting_ranking})
                    .then(response => {
                        let data = response.data;
                        if (data.ok) {
                            success('更新完成')
                            this.reloadPageData()
                        } else {
                            error('更新排名失败: ' + data.msg)
                        }
                        this.rankChangeProcess = false
                        //设置排名后需要重置change状态
                        item.isChange = false
                        //console.log(item.project_id)
                        //window.location.href = "#"+item.project_id;
                    })
            },

            setAwardsConfirm() {
                let error = ''
                let allCount = 0
                this.awards_configure.forEach(function (item) {
                    if (item.number == null || item.number == 0) {
                        error = '请设置' + item.title + '数量'
                    }
                    allCount += item.number
                })

                //是否存在未设置项
                if (error != '') {
                    return warn(error)
                }

                //设置奖项总数是否超过项目数量
                if (allCount > this.projectsCount) {
                    return warn('请重新配置奖项数量（不得超过会评项目总量）')
                }

                this.confirmLoading = true
                axios.post('/api/committee/set-awards-configure',
                    {configure: JSON.stringify(this.awards_configure)})
                    .then(response => {
                        let data = response.data;
                        if (data.ok) {
                            this.reloadPageData()
                            success('设置完成')
                        } else {
                            warn('设置失败: ' + data.msg)
                        }
                        this.confirmLoading = false
                        this.setAwardsDialog = false
                    })
            },

            cancelAwardsConfirm() {
                this.awards_configure = JSON.parse(JSON.stringify(this.awards_configure_default))
                this.awardsNum = this.awards_configure[this.awardsType]['number']
                this.setAwardsDialog = false
            },

            awardsTypeChange() {
                let temp = this.awards_configure[this.awardsType]
                if (temp.number > 0) {
                    this.awardsCount = temp.number
                    this.awardsRatio = Math.ceil((temp.number / this.projectsCount) * 100)
                    this.awardsNum = temp.number
                    this.setAwardsModeChange()
                } else {
                    this.awardsCount = 0
                    this.awardsRatio = 0
                    this.awardsNum = 0
                }
            },
            setAwardsModeChange() {
                let number = this.awards_configure[this.awardsType]['number']
                if (this.setAwardsMode == 'number') {
                    this.awardsNum = number
                } else {
                    this.awardsNum = Math.ceil((number / this.projectsCount) * 100)
                }
            },
            setAwardsNumChange(val) {
                if (this.setAwardsMode == 'number') {
                    this.awardsNumMax = this.projectsCount
                    this.setNumPlaceholder = '入选数量(0~' + this.awardsNumMax + ')'
                    this.awardsCount = val
                    this.awardsRatio = Math.round((val / this.projectsCount) * 100)

                    this.awards_configure[this.awardsType].number = val
                } else {
                    this.awardsNumMax = 100
                    this.setNumPlaceholder = '入选比例(0~100)'
                    this.awardsCount = Math.round(this.projectsCount * (val / 100))
                    this.awardsRatio = val

                    this.awards_configure[this.awardsType].number = this.awardsCount
                }
            },


            /**
             * 提交网评二次确认
             * @start
             */
            submitMeetingConfirm(flag) {
                if (flag) {
                    this.submitMeetingConfirmTip.confirmCount++
                    if (this.submitMeetingConfirmTip.confirmCount == 2) {
                        this.submitMeetingConfirmClearStatus()
                        return this.handleSubmitMeetingReviewResult()
                    } else {
                        this.submitMeetingConfirmTip.flag = false
                        loading('二次确认')
                        let _this = this
                        setTimeout(function () {
                            dismiss()
                            _this.submitMeetingConfirmTip.flag = true
                            _this.submitMeetingConfirmTip.title = '再次确认'
                            _this.submitMeetingConfirmTip.message = '您将要提交会评结果，此操作无法撤销！！！'
                        }, 1200)
                    }
                } else {
                    this.submitMeetingConfirmClearStatus()
                }
            },

            submitMeetingConfirmClearStatus() {
                this.submitMeetingConfirmTip = {
                    flag: false,
                    title: '操作确认',
                    message: '确认提交会评结果?',
                    confirmCount: 0,
                }
            },
            /**
             * 提交网评二次确认
             * @end
             */

            ...CommitteeHeader.methods,
            ...CommitteeAside.methods,
            ...Workflow.methods,
        }
    })
</script>

</body>
</html>


